<template>
    <view class="content">
        <view class="address">
            <view class="address-list" v-for="(item, index) in address" :key="index">
                <view class="address-info">
                    <!-- <view class="u-flex u-row-left u-col-center">
                        <view class="name">{{item.name}}</view>
                        <view class="tel u-padding-left-15">{{item.mobile}}</view>
                    </view> -->
                    <view class="Add">
                        {{item.address}}
                    </view>
                </view>
                <view class="operation u-flex u-row-between">
                    <view class="choice u-flex">
                        <u-checkbox @change="checkChange(item)" v-model="item.is_default==1?true:false"  
                            size="32" active-color="#f29700" label-size="26" shape="circle">设为默认</u-checkbox>
                    </view>
                    <view class="right u-flex">
                        <view class="u-flex" @click.stop="openPage('/mine/pages/address/newAddress',item.id)">
                            <image src="/static/icon/z-editor.png"></image>
                            <text>编辑</text>
                        </view>
                        <view class="u-flex u-m-l-40" @click.stop="delAddress(item.id)">
                            <image src="/static/icon/z-del.png"></image>
                            <text>删除</text>
                        </view>
                    </view>
                </view>
                <!-- <image src="/static/icon/line.png" class="line"></image> -->
            </view>
        </view>

        <view class="address-btn" @click="$gTo('/mine/pages/address/newAddress')">
            新建地址+
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                address: [],
            };
        },
        onShow() {
        	this.getAddress()
        },
        methods: {
            // 获取地址列表
            getAddress() {
                var _this = this;
                this.$ajax('user_address', {
                    user_token: this.$getSync('userToken'),
                }).then(ret => { 		
                    if (ret.success == 1000) {
                    	this.address = ret.detail
                    } else {
                    	this.$toast(ret.msg);
                    }
                })
            },
            // 设为默认地址
            checkChange(item){
            	this.$ajax('update_is_default', {
            		user_token: this.$getSync('userToken'),
            		id: item.id,
                    is_default: item.is_default == 1 ? 0 : 1,//1默认 0不默认
                }).then(ret => { 	
                    if (ret.success == 1000) {
                        this.getAddress()
                    } else {
                        this.$toast(ret.msg);
                    }
            	})
            },
            delAddress(id) {
            	var that = this
            	uni.showModal({
                    title: '温馨提示',
            		content: '您确定删除此地址吗？',
            		confirmText: "确认",
            		cancelText: '取消',
            		confirmColor: '#f29700',
            		success: (res) => {
            			if (res.confirm) {
            				this.$ajax('delete_address', {
            					user_token: this.$getSync('userToken'),
            					id: id
            				}).then(ret => { 
                                if (ret.success == 1000) {
                                	that.getAddress()
                                	that.$toast('删除成功！')
                                } else {
                                	that.$toast(ret.msg);
                                }
            				})
            			} else {
            			}
            		}
            	})
            },
            openPage(str,id){
            	uni.navigateTo({
                    url: str + "?id=" + id
            		// url:str + "?item=" + encodeURIComponent(JSON.stringify(item)) + '&from=from'
            	})
            },
        }
    };
</script>

<style>
    page {
        background-color: #f5f5f5;
    }
</style>

<style lang="scss" scoped>
    
    .content {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 100%;
        padding: 20rpx;
    }

    //提示信息
    .addrss-Tips {
        width: 100%;
        font-size: 34rpx;
        color: #8a8a8a;
        padding-top: 183rpx;

        .t-pic {
            display: block;
            width: 152rpx;
            height: 277rpx;
            margin: 0 auto 40rpx;
        }
    }

    // 地址列表
    .address {
        width: 100%;

        .address-list {
            width: 100%;
            background-color: #ffffff;
            border-radius: 15rpx;
            margin-bottom: 20rpx;

            .address-info {
                width: 100%;
                padding: 35rpx 20rpx;

                .name,
                .tel {
                    font-size: 32rpx;
                    color: #313131;
                    font-weight: bold;
                    line-height: 1;
                }

                .Add {
                    font-size: 28rpx;
                    color: #000;
                    // line-height: 37rpx;
                    // margin-top: 10rpx;
                }
            }

            // 操作
            .operation {
                width: 100%;
                // height: 85rpx;
                padding: 0 20rpx 35rpx;
                // border-top: 1rpx solid #e6e6e6;

                .choice,
                .right {
                    font-size: 26rpx;
                    color: #313131;

                    image {
                        display: block;
                        width: 34rpx;
                        height: 34rpx;
                    }

                    .circle {
                        width: 34rpx;
                        height: 34rpx;
                        border: 1rpx solid #ababab;
                        border-radius: 34rpx;
                        margin: 0 12rpx;

                        image {
                            display: none;
                        }
                    }


                    text {
                        margin-left: 12rpx;
                    }
                }

                .active {
                    border: 0 !important;

                    image {
                        display: block!important;
                    }
                }

            }

            .line {
                display: block;
                width: 750rpx;
                height: 3rpx;
            }
        }


    }



    // 按钮
    .address-btn {
        width: 686rpx;
        font-size: 34rpx;
        color: #fff;
        line-height: 94rpx;
        text-align: center;
        border-radius: 15rpx;
        background: #f29700;
        margin: 70rpx auto 90rpx;
    }
</style>
